<!DOCTYPE html>

<html lang="en" data-content_root="../">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /><meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>Overview of Pytch design &#8212; Pytch  documentation</title>
    <link rel="stylesheet" type="text/css" href="../_static/pygments.css?v=03e43079" />
    <link rel="stylesheet" type="text/css" href="../_static/classic.css?v=36340f97" />
    <link rel="stylesheet" type="text/css" href="../_static/css/pytch-classic.css?v=0321735e" />
    
    <script src="../_static/documentation_options.js?v=7f41d439"></script>
    <script src="../_static/doctools.js?v=9bcbadda"></script>
    <script src="../_static/sphinx_highlight.js?v=dc90522c"></script>
    
    <link rel="icon" href="../_static/favicon.ico"/>
    <link rel="author" title="About these documents" href="../about.html" />
    <link rel="index" title="Index" href="../genindex.html" />
    <link rel="search" title="Search" href="../search.html" />
    <link rel="next" title="Pytch VM (developer guide)" href="../vm/developer/index.html" />
    <link rel="prev" title="Getting started with Pytch development" href="development-setup.html" /> 
  </head><body>
<div class="NavBar">
  <a href="../../app/"><h1>Pytch</h1></a>
  <ul>
    <a href="https://pytch.scss.tcd.ie/"><li>About Pytch</li></a>
    <a href="../index.html"><li>Help</li></a>
    <a href="../../app/tutorials/"><li>Tutorials</li></a>
    <a href="../../app/my-projects/"><li>My projects</li></a>
  </ul>
</div>
<div class="warning-work-in-progress">
  <p>These help pages are incomplete — we are working on it!</p>
</div>
  

    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body" role="main">
            
  <section id="overview-of-pytch-design">
<h1>Overview of Pytch design<a class="headerlink" href="#overview-of-pytch-design" title="Link to this heading">¶</a></h1>
<p>Pytch is made of several components.  A summary follows, with more
detail on each one below.</p>
<dl class="simple">
<dt>Skulpt-based Python runtime (<code class="docutils literal notranslate"><span class="pre">pytch-vm</span></code>, for “Virtual Machine”) <a class="reference internal" href="../vm/developer/index.html"><span class="doc">[more]</span></a></dt><dd><p>A fork of the Skulpt system for running Python in the browser.  We
have made a small change to the compiler, added a library of
user-visible and support functions for running Pytch programs, and
created a concurrency system resembling Scratch’s.</p>
</dd>
<dt>Webapp (<code class="docutils literal notranslate"><span class="pre">pytch-webapp</span></code>) <a class="reference internal" href="../webapp/developer/index.html"><span class="doc">[more]</span></a></dt><dd><p>The React-based frontend app.  Browser-based storage of user
projects.  Allows user to edit program text, and add images and
sounds.  Feeds user programs to the VM, drives the concurrency
scheduler, and displays the results frame-by-frame on the stage.
Handles content printed to stdout by the VM, and errors thrown by
the VM.  Integrates self-paced tutorials (see below).</p>
</dd>
<dt>Media library (<code class="docutils literal notranslate"><span class="pre">pytch-medialib</span></code>) <a class="reference internal" href="../medialib/developer/index.html"><span class="doc">[more]</span></a></dt><dd><p>Skeleton which will in due course hold the media assets (images and
sounds) for users to use in their projects, and for use in
tutorials.  Currently, the assets live in the <code class="docutils literal notranslate"><span class="pre">pytch-tutorials</span></code>
repo and there’s a build stage which populates the media library.</p>
</dd>
<dt>Tutorials (<code class="docutils literal notranslate"><span class="pre">pytch-tutorials</span></code>) [see <a class="reference internal" href="../build-tools/index.html"><span class="doc">Build tools</span></a> for more]</dt><dd><p>Data for the self-paced tutorials.  This repo is unusual in that the
entire history of a branch is important, not just the current state.
Each tutorial has its own branch.  Commits which update the Python
code are available for inclusion as diffs in the tutorial as
presented to the user.</p>
</dd>
<dt>Build tools (<code class="docutils literal notranslate"><span class="pre">pytch-build</span></code>) <a class="reference internal" href="../build-tools/index.html"><span class="doc">[more]</span></a></dt><dd><p>Mostly used to turn the tutorials into a form ready for inclusion in
the webapp.  The main tool is a “compiler” which reads the git
history of each tutorial’s branch, and emits a big lump of HTML, as
well as an index.  The webapp then requests this and presents it to
the user in interactive form.  Also contains scripts to help develop
the system.</p>
</dd>
<dt>Website (<code class="docutils literal notranslate"><span class="pre">pytch-website</span></code>)</dt><dd><p>Content of the Pytch website which is not the app.  Documentation is
driven from here, although it brings in sections taken from the
other repos.</p>
</dd>
<dt>Top-level superproject (<code class="docutils literal notranslate"><span class="pre">pytch-releases</span></code>)</dt><dd><p>Combines all the above.  Also has various build and set-up scripts.</p>
</dd>
</dl>
</section>


            <div class="clearer"></div>
          </div>
        </div>
      </div>
      <div class="sphinxsidebar" role="navigation" aria-label="Main">
        <div class="sphinxsidebarwrapper"><ul class="current">
<li class="toctree-l1"><a class="reference internal" href="../webapp/user/index.html">Using the Pytch web app</a></li>
<li class="toctree-l1"><a class="reference internal" href="../vm/user/index.html">Writing Pytch programs</a></li>
<li class="toctree-l1"><a class="reference internal" href="../about.html">About Pytch</a></li>
<li class="toctree-l1"><a class="reference internal" href="../contact.html">Contact</a></li>
<li class="toctree-l1 current"><a class="reference internal" href="../developer.html">Developer documentation</a><ul class="current">
<li class="toctree-l2"><a class="reference internal" href="development-setup.html">Development setup</a></li>
<li class="toctree-l2 current"><a class="current reference internal" href="#">Design overview</a></li>
<li class="toctree-l2"><a class="reference internal" href="../vm/developer/index.html">VM</a></li>
<li class="toctree-l2"><a class="reference internal" href="../webapp/developer/index.html">Webapp</a></li>
<li class="toctree-l2"><a class="reference internal" href="../medialib/developer/index.html">Media library</a></li>
<li class="toctree-l2"><a class="reference internal" href="index.html">Website</a></li>
<li class="toctree-l2"><a class="reference internal" href="../build-tools/index.html">Tools</a></li>
<li class="toctree-l2"><a class="reference internal" href="../source-build.html">Source and build information</a></li>
<li class="toctree-l2"><a class="reference internal" href="../releases/changelog.html">Changelog</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../legal/index.html">Legal information</a></li>
</ul>
<div class="docs-home-link"><hr>
  <ul>
    <li>
      <a href="../index.html">Pytch help home</a>
    <li>
  </ul>
</div>
        </div>
      </div>
      <div class="clearer"></div>
    </div>
  </body>
</html>